<template>
	<view class="fixed-bottom flex align-center justify-between bg-white pl-1" style="width: 100%;height: 50px;">
		<view class="flex align-center" @click="fullCheck">
			<radio :checked="isFullCheck" color="#c00000">
				<text>全选</text>
			</radio>
		</view>
		<view>
			合计:<text style="color:#c00000;">￥{{cartStore.checkedGoodsAmount}}</text>
		</view>
		<view style="height: 50px;line-height: 50px;min-width: 100px;text-align: center;background-color: #c00000;"
			class="px-2 text-white" @click="settlement">
			结算({{cartStore.checkedCount()}})
		</view>
	</view>
</template>

<script setup>
	import {
		computed
	} from 'vue';
	import {
		useCartStore
	} from '../../store';
	const cartStore = useCartStore()
	const isFullCheck = computed(() => {
		return cartStore.total === cartStore.checkedCount()
	})

	const fullCheck = () => {
		cartStore.updateAllGoodsState(!isFullCheck.value)
	}

	const settlement = () => {
		if (!cartStore.checkedCount()) {
			return uni.showModal({
				title: "请选择要结算的商品!"
			})
		}
	}
</script>

<style>

</style>